﻿<h3 class="title">Historical Prices</h3>

@*@using (@Html.BeginForm("Search", "Stock", null, FormMethod.Post, new { @class="form-search" }))
{
    @Html.ValidationSummary(true)
    <input type="text" name="searchTerms" class="input-medium search-query">
    <button type="submit" class="btn">Search</button>
}*@

@using (Ajax.BeginForm("Search", "Stock",
    new AjaxOptions
    {
        InsertionMode = InsertionMode.Replace,
        HttpMethod = "GET",
        OnFailure = "searchFailed",
        LoadingElementId = "ajax-loading",
        UpdateTargetId = "searchResults"
    }
    ))
{
    <input type="text" class="input-medium search-query" data-autocomplete-source="@Url.Action("Search", "Stock")" />
    <button type="submit" class="btn">Search</button>
    <div id="searchResults"></div>
}

<p>
    <div id="searchResultsX"></div>
</p>

<table class="table table-striped table-bordered">
    <caption>Portfolio summary</caption>
    <thead>
        @*<tr>
            <th colspan="3">&nbsp;</th>
            <th colspan="2" class="text-center">Portfolio correction dates</th>
        </tr>*@
        <tr>
            <th>Code</th>
            <th>Name</th>
            <th>Description</th>
            <th>Last correction</th>
            <th>Next correction</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>RANDONE</td>
            <td>Random fund one</td>
            <td>Sample random fund one</td>
            <td>2013-04-01</td>
            <td>2013-04-31</td>
        </tr>
        <tr>
            <td>RANDTWO</td>
            <td>Random fund two</td>
            <td>Sample random fund two</td>
            <td>2013-04-01</td>
            <td>2013-04-31</td>
        </tr>
        <tr>
            <td>RANDTHREE</td>
            <td>Random fund three</td>
            <td>Sample random fund three</td>
            <td>2013-04-01</td>
            <td>2013-04-31</td>
        </tr>
        <tr>
            <td>JAPAUTO</td>
            <td>Japan automobile</td>
            <td>Japan automobile industry</td>
            <td>2013-04-01</td>
            <td>2013-04-31</td>
        </tr>
        <tr>
            <td>IT</td>
            <td>Info Tech</td>
            <td>Information technology industry</td>
            <td>2013-04-01</td>
            <td>2013-04-31</td>
        </tr>
    </tbody>
</table>
<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.min.js")" type="text/javascript"></script>
@section scripts
{
    <script type="text/javascript">
        function searchFailed() {
            $("#search-results").html("Not found");
        }

        $(document).ready(function () {
            $("input[data-autocomplete-source]").each(function () {
                var target = $(this);
                target.autocomplete({
                    source: target.attr("data-autocomplete-source")
                });
            });
        });
    </script>
}
